<template>
    <div id="OrderDetails">
        <el-button type="primary" class="goback" @click="goback">返回上一级</el-button>
        <h3 class="title">{{pageData.title}}</h3>
        <el-form ref="form"  v-loading="false" class="form">
        <el-form-item  v-for="(item,key) in pageData.listData" :key="key">
            <label class="item-title">{{item.value}}：</label>
            <el-input class="item-input" :value="Param[item.key]" readonly></el-input>   
        </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import Data from './detailData.js'
export default {
    data(){
        return JSON.parse(JSON.stringify(Data))
    },
    mounted(){
      this.Param=this.$route.query;
      console.log(this.Param)
    },
    methods:{
        goback(){ //返回上一级
            this.$router.push(
                {path:"/discount"}
            )
        }
    }
}
</script>
<style scoped lang="css">
    #OrderDetails{
        width:100%;
        height: 100%;
    }
    .goback{
        margin-top: 20px;
    }
    .title{
        text-align: center;
        width:1000px;;
    }
    .item{
        display: flex;
        align-items: center;
    }
    .item-title{
        width:200px;
        text-align: right;
        display: inline-block;
    }
    .item-input{
       width: 400px;
        margin-left:10px;
    }
    .form{
        width:1000px;
        margin-top: 20px;
        background-color: #fff;
        padding:20px;
        box-sizing: border-box;
    }
</style>

